<template>
  <div class="app-container">
    <!-- Header -->
    <HeaderBar 
      @mainTabChanged="onMainTabChange" 
      :currentMainTab="mainTab" 
    />

    <!-- Sub Tabs -->
    <SubTabs 
      v-if="subTabs.length" 
      :tabs="subTabs" 
      :currentTab="subTab"
      @subTabChanged="onSubTabChange" 
    />

    <!-- Body 内容区域 -->
    <main class="main-content">
      <component 
        :is="currentComponent" 
        @go-to-purchase-detail="handleGoToPurchaseDetail"
        @go-to-purchase-monitor="handleGoToPurchaseMonitor"  
        @go-to-purchase-detail-onlyRead="handleGoToPurchaseDetailOnlyRead"  
        ></component>
    </main>
    <AppFooter />
  </div>
</template>

<script setup>
import { ref, computed } from 'vue'
import HeaderBar from '@/components/HeaderBar.vue'
import AppFooter from '@/components/AppFooter.vue'
import SubTabs from '@/components/SubTabs.vue'
import model from '@/pages/model.vue'
import PurchasePlan from '@/pages/purchase/views/PurchasePlan.vue'
import PurchasePlanDetail from '@/pages/purchase/views/PurchasePlanDetail.vue'
import PurchaseMonitor from '@/pages/purchase/views/PurchaseMonitor.vue'
import PurchasePass from '@/pages/purchase/views/PurchasePass.vue'
import PurchasePassList from '@/pages/purchase/views/PurchasePassList.vue'
import Supplier from '@/pages/purchase/views/Supplier.vue'
import DeviceBasicInfoInput from '@/pages/deviceProfile/views/DeviceBasicInfoInput.vue'
import DeviceProfileManage from '@/pages/deviceProfile/views/DeviceProfileManage.vue'
import DeviceUse from '@/pages/deviceUse/views/DeviceUse.vue'
import DeviceUseAnalysis from '@/pages/deviceUse/views/DeviceUseAnalysis.vue'
import DeviceRepo from '@/pages/deviceUse/views/DeviceRepo.vue'
import OperationLog from '@/pages/log_operation/OperationLog.vue'
import DeviceScrap from '@/pages/device_life/views/ScrapRequest.vue'
import ScrapApproval from '@/pages/device_life/views/ScrapApproval.vue'
import ScrapDiaposal from '@/pages/device_life/views/ScrapDisposal.vue'
import ScrapTracking from '@/pages/device_life/views/ScrapTracking.vue'
import RepairRequest from '@/pages/device_life/views/RepairRequest.vue'
import RepairAssign from '@/pages/device_life/views/RepairAssign.vue'
import RepairProcess from '@/pages/device_life/views/RepairProcess.vue'
import RepairPartApprove from '@/pages/device_life/views/RepairPartApprove.vue'
import RepairComplete from '@/pages/device_life/views/RepairComplete.vue'
import RepairTracking from '@/pages/device_life/views/RepairTracking.vue'
import MantenancePlan from '@/pages/device_life/views/MantenancePlan.vue'
import MantenanceRecord from '@/pages/device_life/views/MantenanceRecord.vue'
import ScrapStats from '@/pages/device_life/views/ScrapStats.vue'
import UserManage from '@/pages/admin/views/UserManage.vue'
import UserRoleManage from '@/pages/admin/views/UserRoleManage.vue'
import UserRoleRequest from '@/pages/admin/views/UserRoleRequest.vue'
import RepairStats from '@/pages/device_life/views/RepairStats.vue'
import MantenanceStats from '@/pages/device_life/views/MantenanceStats.vue'
// 主tab选项
const mainTab = ref('purchase')
// 子tab选项
const subTab = ref('')
// 子tab数据
const subTabsMap = {
  'purchase': ['采购计划', '采购设备详情','采购流程监控'],
  'deviceProfile': ['档案管理','查看供应商'],
  'deviceScrap': ['报废申请审批','报废处理记录','报废数据统计'],
  'deviceUse':['查看使用情况','设备使用分析','设备库'],
  'scrapRequest':['设备报废申请','处理情况跟踪'],
  'repairRequest':['设备维修申请','处理情况跟踪'],
  'purchaseManage':['采购申请处理','申请处理记录','采购完成情况'],
  'scrapManage':['报废申请审批','报废数据统计'],
  'deviceRepair':['维修申请派单','维修过程记录','维修数据统计'],
  'repairManage':['维修零件报销','维修通过审批','维修数据统计'],
  'deviceMantenance':['维护计划制定','维护过程记录','维护数据统计'],
  'UserManage':['用户信息管理','用户权限管理'],
  'UserRoleRequest':['权限申请'],
  'PurchasePass':['审批采购申请','查看设备详情列表']
}
//当前主tab下的子tab数组
const subTabs = computed(() => subTabsMap[mainTab.value] || [])

// 当前 body 区域显示组件
const currentComponent = computed(() => {
  
  if (mainTab.value === 'purchase') {
    switch (subTab.value) {
      case '采购计划': return PurchasePlan
      case '采购设备详情': return PurchasePlanDetail
      case '采购流程监控': return PurchaseMonitor
    }
  }else if (mainTab.value === 'deviceProfile') {
    switch (subTab.value) {
      case '档案管理': return DeviceProfileManage
      case '查看供应商': return Supplier
      case '设备维修': return DeviceRepair
      case '设备报废': return DeviceScrap
    }
  }else if (mainTab.value === 'deviceScrap') {
    switch (subTab.value) {

      case '报废申请审批': return ScrapApproval
      case '报废处理记录': return ScrapDiaposal
      case '报废数据统计': return ScrapStats
    }
  }
  else if (mainTab.value === 'log') {
     return OperationLog
  }
  else if(mainTab.value==='deviceUse'){
    switch(subTab.value){
      case '查看使用情况': return DeviceUse
      case '设备使用分析': return DeviceUseAnalysis
      case '设备库': return DeviceRepo
    }
  }else if(mainTab.value==='scrapRequest'){
    switch(subTab.value){
      case '设备报废申请': return DeviceScrap
      case '处理情况跟踪': return ScrapTracking
    }
  }else if(mainTab.value==='repairRequest'){
    switch(subTab.value){
      case '设备维修申请': return RepairRequest
      case '处理情况跟踪': return RepairTracking
    }
  }else if(mainTab.value==='purchaseManage'){
    switch(subTab.value){
      case '采购申请处理': return ''
      case '申请处理记录': return ''
      case '采购完成情况': return ''
    }
  }else if(mainTab.value==='scrapManage'){
    switch(subTab.value){
      case '报废申请审批': return ScrapApproval
      case '报废数据统计': return ScrapStats
    }
  }else if(mainTab.value==='deviceRepair'){
    switch(subTab.value){
      case '维修申请派单': return RepairAssign
      case '维修过程记录': return RepairProcess
      case '维修数据统计': return RepairStats
    }
  }else if(mainTab.value==='repairManage'){
    switch(subTab.value){
      case '维修零件报销': return RepairPartApprove
      case '维修通过审批': return RepairComplete
      case '维修数据统计': return RepairStats
    }
  }else if(mainTab.value==='deviceMantenance'){
    switch(subTab.value){
      case '维护计划制定': return MantenancePlan
      case '维护过程记录': return MantenanceRecord
      case '维护数据统计': return MantenanceStats
    }
  }else if(mainTab.value==='UserManage'){
    switch(subTab.value){
      case '用户信息管理': return UserManage
      case '用户权限管理': return UserRoleManage
    }
  }else if(mainTab.value==='UserRoleRequest'){
    switch(subTab.value){
      case '权限申请': return UserRoleRequest
    }
  }else if(mainTab.value==='PurchasePass'){
    switch(subTab.value){
      case '审批采购申请': return PurchasePass
      case '查看设备详情列表': return PurchasePassList
    }
  }

})




// 切换主tab时重置子tab
function onMainTabChange(tab) {
  mainTab.value = tab
  subTab.value = subTabsMap[tab]?.[0] || ''
}

function onSubTabChange(tab) {
  subTab.value = tab
}



const handleGoToPurchaseDetail = (receivedPlanId,name,status) => {
  mainTab.value = 'purchase'; 
  subTab.value = '采购设备详情';
  sessionStorage.setItem('currentPurchasePlanId', receivedPlanId);
  sessionStorage.setItem('currentPurchasePlanName', name);
  sessionStorage.setItem('currentPurchasePlanStatus', status);
};


const handleGoToPurchaseMonitor = (receivedPlanId,name,status) => {
  mainTab.value = 'purchase'; 
  subTab.value = '采购流程监控'; 
  sessionStorage.setItem('currentPurchasePlanId', receivedPlanId);
  sessionStorage.setItem('currentPurchasePlanName', name);
  sessionStorage.setItem('currentPurchasePlanStatus', status);
};

const handleGoToPurchaseDetailOnlyRead = (receivedPlanId,name,status) => {
  mainTab.value = 'PurchasePass'; 
  subTab.value = '查看设备详情列表'; 
  sessionStorage.setItem('currentPurchasePlanId', receivedPlanId);
  sessionStorage.setItem('currentPurchasePlanName', name);
  sessionStorage.setItem('currentPurchasePlanStatus', status);
};
</script>

<style scoped>
.app-container {
  padding-top: 120px; /* 为固定header和sub-tabs留出空间 */
  /* padding-bottom: 60px; */
}

.main-content {
  padding: 20px;
  min-height: calc(100vh - 305px);
  /* max-height: calc(100vh - 310px); */
}
</style>